/**
 * @Title: table-form-teacher.js
 * @Description: table-form
 * @author: Fanchao
 * @date: 2020/8/30 11:49 下午
 * @version V1.0
 */

import React from 'react';
import { Radio, Table } from 'antd';

const TableForm = ({ questionSnapshotsModelList, evaluatePlanSnapshotsModel: { planSnapshotsDetailModels } }) => {
    const createNewArr = (data) => {
        return data.reduce((result, item) => {
            //首先将name字段作为新数组result取出
            if (result.indexOf(item.category) < 0) {
                result.push(item.category);
            }
            return result;
        }, []).reduce((result, category) => {
            //将name相同的数据作为新数组取出，并在其内部添加新字段**rowSpan**
            const children = data.filter(item => item.category === category);
            result = result.concat(
                children.map((item, index) => ({
                    ...item,
                    //将第一行数据添加rowSpan字段
                    rowSpan: index === 0 ? children.length : 0,
                })),
            );
            return result;
        }, []);
    };
    const columns = [
        // {
        //     title: '序号',
        //     align: 'left',
        //     render: (text, row, index) => {
        //         return {
        //             children: index + 1,
        //             props: {
        //                 rowSpan: row.rowSpan,
        //             },
        //         };
        //     },
        // },
        {
            title: '项目',
            dataIndex: 'category',
            key: 'category',
            align: 'left',
            render: (text, row, index) => {
                return {
                    children: row.category,
                    props: {
                        rowSpan: row.rowSpan,
                    },
                };
            },
        },
        {
            title: '指标点',
            dataIndex: 'checkPoint',
            key: 'checkPoint',
            align: 'left',
        },
        {
            title: '权重',
            dataIndex: 'weight',
            key: 'weight',
            align: 'left',
        },
    ];
    for (let i = 0; i < planSnapshotsDetailModels.length; i++) {
        columns.push({
            title: () => {
                return (
                    <>
                        <div>{planSnapshotsDetailModels[i].optionContent}</div>
                        <div>{planSnapshotsDetailModels[i].score}</div>
                    </>
                );
            },
            align: 'left',
            render: (text, row, index) => {
                return (
                    <Radio disabled/>
                );
            },
        });
    }

    return (
        <>
            <Table
                bordered={true} // 是否有边框
                columns={columns}
                rowKey='evaluateQuestionSnapshotsId'
                dataSource={createNewArr(questionSnapshotsModelList)}
                pagination={false}
            />
        </>
    );
};

export default TableForm;
